<template>
	<view class="pageBox">
		<view style="padding: 20upx;background-color: #fff;border-bottom: 1upx dashed #ccc;" @tap="getAddAuthor">
			<view v-if="address.provinceName" style="">
				<view class="flex flex-j-b">
					<view>姓名：{{address.userName}}</view>
					<view>电话：{{address.telNumber}}</view>
				</view>
				<view>地址：{{address.provinceName}}{{address.cityName}}{{address.countyName}}{{address.detailInfo}}</view>
			</view>
			<view v-else>选择地址</view>
		</view>
		<view style="background-color: #fff;padding: 20upx;">商品详情</view>
		<!--  -->
		<view class="flex" style="border-top:1upx solid #eee;border-bottom: 1upx solid #ccc;padding: 20upx;background-color: #fff;">
			<image :src="detail.img_url" mode="aspectFill" style="width: 200upx;height: 200upx;margin-right: 20upx;"></image>
			<view class="flex" style="flex-direction: column;justify-content: space-between;width: 60%;">
				<view>{{detail.name}}</view>
				<view class="flex flex-j-b" style="width: 100%;">
					<view style="color: #DD524D;">￥{{(detail.unit_price).toFixed(2)}}</view>
					<view>数量：{{number}}</view>
				</view>
			</view>
		</view>
		<!--  -->
		<view style="text-align: right;background-color: #fff;padding: 20upx;">合计：<text style="color: #DD524D;">{{totalPrice}}</text></view>
		<view class="bottomSub flex flex-j-b">
			<view style="font-size: 26upx;font-weight: 900;color: #DD524D;margin-left: 10upx;">￥{{totalPrice}}</view>
			<view class="subBtn" @tap="sub">提交订单</view>
		</view>
		
		<web-view v-if="payUrl" :src="payUrl"></web-view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				detail: {
					unit_price: 0,
				},
				number: 0,
				
				address: {},
				detailJsonStr: '',
				
				totalPrice: 0,
				
				payUrl: '',
			};
		},
		onLoad(options) {
			this.detail = JSON.parse(options.detail);
			this.number = options.number;
			this.totalPrice = (this.detail.unit_price * this.number).toFixed(2);
		},
		methods:{
			getAddAuthor(){
				let self = this;
				uni.authorize({
				    scope: 'scope.address',
				    success(res) {
						self.getWxAddress()
				    }
				})
			},
			getWxAddress(){
				let self = this;
				uni.chooseAddress({
					success(res) {
					 //    console.log(res.userName)
					 //    console.log(res.postalCode)
					 //    console.log(res.provinceName)
					 //    console.log(res.cityName)
					 //    console.log(res.countyName)
					 //    console.log(res.detailInfo)
					 //    console.log(res.nationalCode)
					 //    console.log(res.telNumber)
						self.address = res;
					}
				})
			},
			valid(){
				if(!this.address.provinceName) {
					uni.showToast({title: '请选择收获地址',icon:'none'})
					return false;
				}
				return true;
			},
			sub(){
				if(!this.valid()) return;
				let self = this;
				uni.showLoading({title: '加载中',mask: true,duration: 5000});
				// this.config.post('/api/order/createOrder', {
				this.config.post('/api/order/weixinPay', {
					detailJsonStr: JSON.stringify([
						{
							productId: this.detail.id,
							num: this.number
						}
					]),
					addressId: JSON.stringify(this.address)
				}).then(res=>{
					uni.hideLoading();
					if(res.data.code==='0'){
						uni.showToast({title: res.data.message,icon:'success'});
						setTimeout(s=>{
							let obj = res.data.result
							self.pay(obj)
						},500)
					}else{
						uni.showToast({title: self.config.handleError(res.data),icon: 'none'});
					}
				})
			},
			pay(obj){
				// console.log(obj, '有了')
				uni.requestPayment({
				    provider: 'wxpay',
				    timeStamp: obj.timeStamp, //String(Date.now()),
				    nonceStr: obj.nonceStr,
				    package: obj.package,
				    signType: obj.signType,
				    paySign: obj.paySign,
				    success: function (res) {
				        console.log('success:' + JSON.stringify(res));
						uni.showToast({
							title: '付款成功！'
						})
						setTimeout(s=>{
							uni.navigateBack()
						},500)
				    },
				    fail: function (err) {
				        console.log('fail:' + JSON.stringify(err));
				    }
				});
			}
		}
	}
</script>

<style lang="less" scoped>
	.pageBox{
		position: fixed;
		width: 100%;
		height: 100%;
		left: 0;top: 0;
		background-color: #eee;
	}
	.bottomSub{
		position: fixed;
		left: 0;bottom: 0;
		width: 100%;
		height: 90upx;
		background-color: #fff;
		line-height: 90upx;
		.subBtn{
			width: 200upx;text-align: center;
			background-color: #DD524D;color: #fff;
		}
	}
</style>
